import './RotationChart.css'
import React from 'react'
import { Swiper, SwiperSlide } from 'swiper/react';
import { Pagination,Autoplay } from 'swiper';
import 'swiper/css';
import 'swiper/css/navigation';
import 'swiper/css/pagination';
import 'swiper/css/scrollbar';
import 'swiper/css/autoplay';

const RotationChart = (props) => {
  let { rotationImg } = props;
  return (
    <Swiper
    modules={[Pagination, Autoplay]}
    // autoplay
    loop
  >
      <div className="rotation-box">
    
        <div className="swiper-container">
          <div className="swiper-wrapper_box">
            {
              rotationImg.map(item => {
                return (<SwiperSlide
                  key={item.id}
                  className="swiper-slide">
                  <a href={item.linkUrl}>
                    <img className="rotationChart-img"
                      src={item.picUrl} alt="" />
                  </a>
                </SwiperSlide>
                )
              })
            }
          </div>
          {/* <div className="swiper-pagination"></div> */}
        </div>
       
      </div>
      </Swiper>
  );
}
export default RotationChart